<template>
	<view class="fac_main">
		<uni-forms
			ref="formRef"
			label-position="top"
			label-width="120"
			:model="orderData"
		>
			<view class="fac_main_bgBox">
				<view class="fac_header_add" @click="addReturnFactory()">
					<span class="tip_star">*</span>
					<uni-icons size="18" color="#007cff" type="plus-filled"></uni-icons>
					<span>添加报修商品</span>
				</view>
				<view class="fac_goods" v-if="store.state.repairGoodsVos.length > 0">
					<uni-section title="报修" type="line"></uni-section>
					<view class="goods_list">
						<view
							class="goods_list_item"
							v-for="(item, index) in store.state.repairGoodsVos"
							:key="index"
						>
							<view class="goods_list_item_box" @click="addReturnFactory()">
								<view class="label_item">
									<view class="label_item_title">商品名称：</view>
									<view class="label_item_content">
										{{ item.goodsName }}
									</view>
								</view>
								<view class="label_item">
									<view class="label_item_title">商品规格：</view>
									<view class="label_item_content">
										{{ item.goodsSpecName }}
									</view>
								</view>
								<view class="label_item" v-if="item.code">
									<view class="label_item_title">商品序列号：</view>
									<view class="label_item_content">
										{{ item.code }}
									</view>
								</view>
							</view>
							<uni-icons
								type="minus-filled"
								@click="deleteGoodsItemFun(index)"
								color=" rgba(245, 108, 108, 1)"
								size="24"
							></uni-icons>
						</view>
					</view>
				</view>
				<view class="service_mode">
					<uni-section title="请选择服务方式" type="line"></uni-section>
					<!-- <span class="name"></span> -->
					<!-- <span class="tip">查询服务范围</span> -->
				</view>
				<view class="item_fee">
					<!-- <uni-forms-item required label="客户名称" name="name"
						:rules="[{ required: true, errorMessage: '请输入客户名称搜索，获取联系人信息' },]">
						<uni-easyinput placeholderStyle="font-size:28rpx;" suffixIcon="search" v-model="orderData.name"
							@confirm="getUserDataSelect()" @iconClick="getUserDataSelect()" placeholder="请输入客户名称搜索" />
					</uni-forms-item> -->
					<view class="left_right_form">
						<uni-forms-item
							required
							label="服务方式"
							name="repairModuleId"
							:rules="[{required: true, errorMessage: '服务方式'}]"
						>
							<view class="sel_address">
								<view
									class="text_9"
									v-if="!orderData.repairModuleId"
									@click="selectModuleFn()"
								>
									选择服务方式
								</view>
								<view v-else class="service-mode-value">
									{{ moduleName }}
								</view>
								<!-- <uni-icons type="right" size="14" color="#999"></uni-icons> -->
							</view>
							<!-- <uni-data-select @change="changeModuleField" style="width: 100%;"
								v-model="orderData.repairModuleId" :localdata="repairModuleList"></uni-data-select> -->
						</uni-forms-item>
						<uni-forms-item
							required
							name="username"
							:rules="[{required: true, errorMessage: '选择联系人'}]"
							label="联系人"
						>
							<view class="sel_address" style="padding-left: 50rpx">
								<view
									class="text_9"
									v-if="!orderData.username"
									@click="selectUserFn()"
								>
									选择联系人
								</view>
								<view v-else>
									<view
										class="tipadd"
										style="align-items: center; column-gap: 12rpx"
									>
										<uni-icons
											@click="editAddressFn()"
											style="margin-left: 12rpx"
											size="20"
											color="#007cff"
											type="compose"
										></uni-icons>
										<span @click="selectUserFn()" class="user_name">
											{{ orderData.username }}
										</span>
										<span @click="selectUserFn()">{{ orderData.phone }}</span>
									</view>
									<view
										style="
											word-wrap: break-word;
											word-break: break-all;
											text-align: right;
										"
									>
										<span
											@click="selectUserFn()"
											style="color: #777; font-size: 24rpx"
										>
											{{
												[
													orderData.province,
													orderData.city,
													orderData.area,
													orderData.address,
												]
													.filter((o) => o)
													.join('')
											}}
										</span>
									</view>
								</view>
								<uni-icons
									@click="selectUserFn()"
									type="right"
									size="14"
									color="#999"
								></uni-icons>
							</view>
						</uni-forms-item>
					</view>
					<view class="left_right_form">
						<uni-forms-item
							name="receiveAddrVo[customerTakePieceMode]"
							required
							label="取件方式"
						>
							<view class="sel_address" @click="pickMode()">
								<view>
									<view class="tipadd" style="font-size: 28rpx">
										{{
											customerReceiveList[
												orderData.receiveAddrVo.customerTakePieceMode - 1
											].text
										}}
									</view>
									<view
										class="tipadd"
										v-if="orderData.receiveAddrVo.customerTakePieceMode === 2"
										style="color: #777; font-size: 28rpx"
									>
										{{
											[
												orderData.receiveAddrVo.customerReceiveProvince,
												orderData.receiveAddrVo?.customerReceiveCity,
												orderData.receiveAddrVo?.customerReceiveArea,
												orderData.receiveAddrVo?.customerReceiveAddress,
											]
												.filter((o) => o)
												.join('')
										}}
									</view>
									<view
										class="tipadd"
										v-if="orderData.receiveAddrVo.customerTakePieceMode === 2"
										style="color: #777; font-size: 28rpx"
									>
										{{
											orderData.receiveAddrVo?.customerReceiveUsername
										}}&nbsp;&nbsp;{{
											orderData.receiveAddrVo?.customerReceivePhone
										}}
									</view>
								</view>
								<uni-icons type="right" color="#999" size="15"></uni-icons>
							</view>
						</uni-forms-item>
						<uni-forms-item
							v-if="showNetwork"
							required
							name="networkName"
							:rules="[{required: true, errorMessage: '选择服务网点'}]"
							label="服务网点"
						>
							<view class="sel_address" @click="getnetworkList()">
								<view class="text_9" v-if="!orderData.networkId">
									选择维修网点
								</view>
								<view v-else style="">
									<view class="tipadd" style="font-size: 28rpx">
										{{ orderData.networkName?.name }}
									</view>
									<view class="tipadd" style="color: #777; font-size: 24rpx">
										{{
											[
												orderData.networkName?.province,
												orderData.networkName?.city,
												orderData.networkName?.area,
												orderData.networkName?.address,
											]
												.filter((o) => o)
												.join('')
										}}
									</view>
									<view class="tipadd" style="color: #777; font-size: 24rpx">
										<span class="user_name">
											{{ orderData.networkName?.userName }}
										</span>
										&nbsp;&nbsp;{{ orderData.networkName?.phone }}
									</view>
								</view>
								<uni-icons type="right" size="14" color="#999"></uni-icons>
							</view>
						</uni-forms-item>
						<!-- 默认地址 -->
						<uni-forms-item v-else label="返厂地址">
							<template #label>
								<view class="return-factory-address-lebel">返厂地址</view>
							</template>
							<view class="sel_address" style="padding-left: 50rpx">
								<view class="return-factory-address-value">
									<view
										class="tipadd"
										style="align-items: center; column-gap: 12rpx"
									>
										<span class="user_name">{{ defaultAddress.userName }}</span>
										<span>{{ defaultAddress.phone }}</span>
									</view>
									<view
										style="
											word-wrap: break-word;
											word-break: break-all;
											text-align: right;
										"
									>
										<span style="color: #777; font-size: 24rpx">
											{{
												[
													defaultAddress.province,
													defaultAddress.city,
													defaultAddress.area,
													defaultAddress.address,
												]
													.filter((o) => o)
													.join('')
											}}
										</span>
									</view>
								</view>
							</view>
						</uni-forms-item>
					</view>
				</view>
				<view class="service_mode" v-if="orderData.fieldValVos.length > 0">
					<uni-section title="其他信息" type="line"></uni-section>
				</view>
				<view class="item_fee" v-if="orderData.fieldValVos.length > 0">
					<view v-for="(item, index) in orderData.fieldValVos" :key="index">
						<uni-forms-item
							:label="item.name"
							:required="item.required"
							:name="[
								'fieldValVos',
								index,
								item.type === 5 || item.type === 6 || item.type === 7
									? 'imgarr'
									: 'value',
							]"
							:rules="[{required: item.required, errorMessage: item.name}]"
						>
							<view
								class="team_type"
								:class="{
									team_type_:
										(item.type == 4 && item.contentVos.length <= 3) ||
										item.type == 8 ||
										(item.type === 3 && item.contentVos.length <= 3),
								}"
							>
								<!-- 文本1 -->
								<uni-easyinput
									v-model="item.value"
									v-if="item.type === 1"
									placeholderStyle="font-size:28rpx;"
									:placeholder="item.tip"
								/>
								<!-- 多行文本2 -->
								<uni-easyinput
									trim="right"
									autoHeight
									v-model="item.value"
									type="textarea"
									v-if="item.type === 2"
									placeholderStyle="font-size:28rpx;"
									:placeholder="item.tip || '请输入'"
								/>
								<!-- 单选 3-->
								<uni-data-select
									style="width: 100%"
									v-model="item.value"
									v-if="item.type === 3 && item.contentVos.length > 3"
									:localdata="item.contentVos"
								></uni-data-select>
								<uni-data-checkbox
									v-model="item.value"
									v-else-if="item.type === 3"
									:localdata="item.contentVos"
								></uni-data-checkbox>
								<!-- 多选4 -->
								<uni-data-checkbox
									v-if="item.type === 4 && item.contentVos.length <= 3"
									multiple
									v-model="item.value"
									:localdata="item.contentVos"
								></uni-data-checkbox>
								<zxz-uni-data-select
									style="width: 100%"
									:collapseTags="true"
									:collapseTagsNum="1"
									v-else-if="item.type === 4"
									multiple
									:localdata="item.contentVos"
									v-model="item.value"
								></zxz-uni-data-select>
								<!-- 图片 5 -->
								<view class="pic_img" v-if="item.type === 5">
									<uni-file-picker
										@select="(files) => onsuccessImg2(item, files)"
										:auto-upload="false"
										@delete="(file) => ondeleteImg2(item, file)"
										:imageStyles="imageStyles"
										file-mediatype="image"
										v-model="item.imgarr"
										:limit="item.uploadQty"
									/>
								</view>
								<!-- 附件6 -->
								<view class="pic_video" v-if="item.type === 6">
									<view
										class="list_video"
										v-for="(src, imgIndex) in item.imgarr"
										:key="imgIndex"
									>
										<view class="box_video_pdf">
											<uni-icons
												type="closeempty"
												@click="delete_video(item, imgIndex)"
												class="clear_icon"
												size="14"
												color="#fff"
											></uni-icons>
											<view class="pdf_sty" @click="lookPDF(src.url)">PDF</view>
										</view>
									</view>
									<view
										class="btn_uploader"
										v-if="item.uploadQty > item.imgarr.length"
									>
										<uni-icons
											type="plusempty"
											class="icon_plus"
											size="18"
											color="#999"
										></uni-icons>
										<uni-file-picker
											file-extname="pdf"
											fileMediatype="all"
											v-model="item.imgarr"
											:auto-upload="false"
											@select="(file) => chooseFile(item, file)"
										/>
									</view>
								</view>
								<!-- 视频7 -->
								<view class="pic_video" v-if="item.type === 7">
									<view
										class="list_video"
										v-for="(src, imgIndex) in item.imgarr"
										:key="imgIndex"
									>
										<view class="box_video">
											<uni-icons
												type="closeempty"
												@click="delete_video(item, imgIndex)"
												class="clear_icon"
												size="14"
												color="#fff"
											></uni-icons>
											<video
												:src="src.url"
												:controls="false"
												@click="videoUrlShow(src.url)"
												:enable-progress-gesture="false"
												:show-center-play-btn="false"
												class="item_video"
											></video>
										</view>
									</view>
									<view
										class="btn_uploader"
										v-if="item.uploadQty > item.imgarr.length"
									>
										<uni-icons
											type="plusempty"
											class="icon_plus"
											size="18"
											color="#999"
										></uni-icons>
										<uni-file-picker
											fileMediatype="video"
											mode="grid"
											file-extname="mp4,mov"
											:auto-upload="false"
											@select="(file) => chooseVideoImage(item, file)"
										/>
									</view>
								</view>
								<!-- 评分8 -->
								<uni-rate
									v-if="item.type === 8"
									v-model="item.value"
									margin="10"
								/>
								<uni-datetime-picker
									v-if="item.type === 9"
									type="date"
									:clear-icon="false"
									v-model="item.value"
								/>
								<uni-datetime-picker
									:hide-second="true"
									v-if="item.type === 10"
									type="datetime"
									v-model="item.value"
								/>
							</view>
						</uni-forms-item>
					</view>
				</view>
			</view>
		</uni-forms>
		<view class="footer_order">
			<view class="footer_order_right" @click="submitFun">
				<view class="btn">提交</view>
			</view>
		</view>
		<!-- 服务网点 -->
		<uni-popup ref="showPopup_net" :safe-area="false" type="bottom">
			<view class="popup-content">
				<view class="popup-content_title">
					<view class="title_tip">选择服务网点</view>
					<uni-icons
						type="clear"
						size="28"
						color="#ccc"
						@click="showPopup_net.close()"
					></uni-icons>
				</view>
				<view class="search_card">
					<uni-search-bar
						:focus="false"
						class="search_card_bar"
						@confirm="getNetwrokSelectFn()"
						placeholder="服务网点搜索"
						radius="100"
						bg-color="rgba(242, 243, 245, 1)"
						cancelButton="none"
						v-model="selectVo.name"
						@input="input"
					></uni-search-bar>
					<view class="search_btn" @click="input">搜索</view>
				</view>
				<view class="search_muen">
					<view class="msg_kong" v-if="networkList.length == 0">
						暂未查询到服务网点
					</view>
					<view
						v-for="(item, index) in networkList"
						:class="{active_bg: orderData.networkId == item.id}"
						:key="index"
						class="search_muen_item"
						@click="checkNetItem(item)"
					>
						<view class="muen_item_title">
							{{ item.name }}
						</view>
						<view class="muen_item_tip">
							{{
								[item.province, item.city, item.area, item.address]
									.filter((o) => o)
									.join('')
							}}
							<!-- 	<uni-icons
								size="14" class="icon_tip" color="#007cff" type="paperplane-filled"></uni-icons> -->
						</view>
						<view class="muen_item_tip">
							{{ item.userName }} {{ item.phone }}
							<!-- <uni-icons class="icon_tip" color="#007cff" size="14"
								type="phone-filled"></uni-icons> -->
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
		<!--服务方式 -->
		<uni-popup ref="showPopup_way" :safe-area="false" type="bottom">
			<view class="popup-content">
				<view class="popup-content_title">
					<view class="title_tip">选择服务方式</view>
					<uni-icons
						type="clear"
						size="28"
						color="#ccc"
						@click="showPopup_way.close()"
					></uni-icons>
				</view>
				<view class="search_muen">
					<view class="msg_kong" v-if="repairModuleList.length == 0">
						暂未查询到服务方式
					</view>
					<view
						v-for="(item, index) in repairModuleList"
						:class="{active_bg: orderData.repairModuleId == item.id}"
						:key="index"
						class="search_muen_item"
						@click="changeModuleField(item.id)"
					>
						<view class="muen_item_title">
							{{ item.name }}
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
		<!-- 联系人 -->
		<uni-popup ref="showPopup_user" :safe-area="false" type="bottom">
			<view class="popup-content">
				<view class="popup-content_title">
					<view class="title_tip">选择联系人</view>
					<uni-icons
						type="clear"
						size="28"
						color="#ccc"
						@click="showPopup_user.close()"
					></uni-icons>
				</view>
				<view class="search_card">
					<uni-search-bar
						:focus="false"
						class="search_card_bar"
						@confirm="getUserDataSelect()"
						placeholder="请输入客户名称、手机号搜索联系人"
						radius="100"
						bg-color="rgba(242, 243, 245, 1)"
						cancelButton="none"
						v-model="orderData.name"
						@input="getUserDataSelect()"
					></uni-search-bar>
					<view class="search_btn" @click="getUserDataSelect()">搜索</view>
				</view>
				<!-- <view class="add_address">
					<span @click="addUserAddress()">没有联系人？去添加！</span>
				</view> -->
				<view class="search_muen" v-if="userList.length > 0">
					<view
						v-for="(item, index) in userList"
						:key="index"
						class="search_muen_item"
						@click="checkUserItem(item)"
					>
						<view class="">{{ item.username }} {{ item.phone }}</view>
						<view class="" style="color: #777; font-size: 26rpx">
							{{
								[item.province, item.city, item.area, item.address]
									.filter((o) => o)
									.join('')
							}}
						</view>
					</view>
				</view>
				<view
					v-if="orderData.name && userList.length == 0"
					style="
						display: flex;
						justify-content: center;
						align-items: center;
						height: 30%;
						color: #999;
						font-size: 28rpx;
					"
				>
					<view class="tip">
						查无结果...
						<uni-icons type="search" color="#999"></uni-icons>
					</view>
				</view>
				<view
					v-else-if="userList.length == 0"
					style="
						display: flex;
						justify-content: center;
						align-items: center;
						height: 30%;
						color: #999;
						font-size: 28rpx;
					"
				>
					<view class="tip">
						搜索查询...
						<uni-icons type="search" color="#999"></uni-icons>
					</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="showPopup_Pick_up" :safe-area="false" type="bottom">
			<view class="popup-content popup_address">
				<view class="popup-content_title">
					<view class="title_tip">请选择取件方式</view>
					<uni-icons
						type="clear"
						size="28"
						color="#ccc"
						@click="showPopup_Pick_up.close()"
					></uni-icons>
				</view>
				<radio-group style="margin-top: 30rpx" @change="radioChange">
					<label
						class="uni-list-cell"
						v-for="(item, index) in customerReceiveList"
						:key="item.value"
					>
						<view>{{ item.text }}</view>
						<view>
							<radio
								:value="item.value"
								activeBackgroundColor
								:checked="item.value == current"
							/>
						</view>
					</label>
				</radio-group>
				<uni-forms
					v-if="current == 2"
					label-position="top"
					ref="baseForm"
					:modelValue="orderData"
					label-width="80"
				>
					<view class="uni_form">
						<view class="left_right_form">
							<uni-forms-item
								:name="['receiveAddrVo', 'customerReceiveUsername']"
								:rules="[{required: true, errorMessage: '联系姓名'}]"
								required
								label="联系姓名"
							>
								<uni-easyinput
									v-model="orderData.receiveAddrVo.customerReceiveUsername"
									placeholderStyle="font-size:28rpx;"
									placeholder="请输入联系姓名"
								/>
							</uni-forms-item>
							<uni-forms-item
								required
								:rules="baseFormRules.customerReceivePhone.rules"
								:name="['receiveAddrVo', 'customerReceivePhone']"
								label="联系手机号"
							>
								<uni-easyinput
									v-model="orderData.receiveAddrVo.customerReceivePhone"
									type="number"
									placeholderStyle="font-size:28rpx;"
									placeholder="请输入联系手机号"
									maxlength="11"
								/>
							</uni-forms-item>
							<uni-forms-item
								required
								label="所在地区"
								:rules="[{required: true, errorMessage: '所在地区'}]"
								:name="['receiveAddrVo', 'customerReceiveArea']"
							>
								<AreaAddress
									@change="changecustomerReceive"
									ref="addressRef"
									:address_obj="addressValue"
								></AreaAddress>
							</uni-forms-item>
						</view>
						<uni-forms-item
							required
							label="详细地址"
							:rules="[{required: true, errorMessage: '请输入详细地址'}]"
							:name="['receiveAddrVo', 'customerReceiveAddress']"
							style="margin-bottom: 0"
						>
							<view class="message">
								<textarea
									maxlength="200"
									placeholderStyle="font-size:28rpx;"
									placeholder="请输入详细地址"
									:auto-height="true"
									:autosize="false"
									v-model="orderData.receiveAddrVo.customerReceiveAddress"
								/>
								<p
									style="
										text-align: right;
										font-size: 24rpx;
										color: #999;
										padding: 4px;
									"
								>
									{{
										orderData.receiveAddrVo.customerReceiveAddress.length
									}}/200
								</p>
							</view>
						</uni-forms-item>
					</view>
				</uni-forms>
				<view class="address_btn">
					<view class="btn_addres">
						<button type="primary" class="btn" @click="submitChange">
							确定
						</button>
					</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup
			ref="popupvideoRef"
			background-color="#fff"
			@change="urlClickShow"
		>
			<video
				:src="videoUrl"
				:enable-progress-gesture="false"
				:show-center-play-btn="false"
			></video>
		</uni-popup>
		<EditAddress
			:userFormData="orderUser"
			@set-popup="showBottom = $event"
			@value-change="userAddressChange($event)"
			:showpopup="showBottom"
		></EditAddress>
	</view>
</template>

<script setup lang="ts">
	import {ref, onMounted, reactive, watch, nextTick, computed} from 'vue';
	import _ from 'lodash';
	import {onUnload, onShow, onLoad, onHide} from '@dcloudio/uni-app';
	import AreaAddress from '@/components/u-user/AreaAddress.vue';
	import store from '@/store/index.js';
	import return_fac_api from '@/util/api/return_fac_api.js';
	import apiOrder from '@/util/api/order.js';
	import apiUpload from '@/util/api/upload.js';
	import EditAddress from '@/components/editAddress.vue';
	import {moduleId as fixedModuleId} from '@/config/returnFactory';

	/**
	 * 设置服务方式
	 */
	const setServiceMode = async () => {
		await getMobileRepairModule();
		const role = uni.getStorageSync('role_play');
		const moduleId = role === 'u-user' ? fixedModuleId.user : '';
		orderData.value.repairModuleId = moduleId;
		const res = await return_fac_api.getRepairModuleCallbackFactoryAddr(
			moduleId,
		);
		if (res.code === 20000) {
			defaultAddress.value = res.data.row || {};
		}
	};

	/**
	 * 模块名称
	 */
	const moduleName = computed(() => {
		const module = repairModuleList.value.find(
			(item) => item.id === orderData.value.repairModuleId,
		);
		if (module) {
			return module.name;
		}
		return '';
	});

	// 是否显示服务网点
	const showNetwork = computed(() => {
		const temp = repairModuleList.value.find(
			(item) => item.id == orderData.value.repairModuleId,
		);
		if (temp && !temp.enableNetwork) {
			return false;
		}
		return true;
	});
	// 默认返厂地址
	const defaultAddress = ref({});

	const formRef = ref();
	onLoad(async () => {
		await setServiceMode();
		let selectUserVo = {
			limit: 0,
			name: '',
			page: 0,
		};
		return_fac_api.getUserDataSelect(selectUserVo).then((res) => {
			if (res.code == 20000) {
				if (res.data.rows.length > 0) {
					let item = res.data.rows.find((o) => o.select);
					if (item) {
						checkUserItem(item);
						orderData.value.receiveAddrVo = {
							customerReceiveAddress: item.address,
							customerReceiveArea: item.area,
							customerReceiveCity: item.city,
							customerReceivePhone: item.phone,
							customerReceiveProvince: item.province,
							customerReceiveUsername: item.username,
							customerTakePieceMode: 2, //客户取件方式：1-自取，2-快递寄回=收货信息
						};
						addressValue.value = {
							province: item.province, //省
							city: item.city, //市
							area: item.area, //区
							town: '', //镇
						};
					}
				}
			}
		});
	});
	const orderData: any = ref({
		address: '', //客户详细地址
		area: '', //客户地址-县/区
		city: '', //客户地址-市
		province: '', //客户地址-省
		userId: '', //用户ID
		username: '', //客户姓名
		otherPhone: '', //客户其他联系方式
		phone: '', //客户手机号
		repairModuleId: '', //返厂模块ID
		fieldValVos: [], //返厂自定义字段
		networkId: 0, //服务网点
		networkName: '',
		receiveAddrVo: {
			//收货地址
			customerReceiveAddress: '',
			customerReceiveArea: '',
			customerReceiveCity: '',
			customerReceivePhone: '',
			customerReceiveProvince: '',
			customerReceiveUsername: '',
			customerTakePieceMode: 1, //客户取件方式：1-自取，2-快递寄回=收货信息
		},
		repairGoodsVos: [], //返厂商品
	});
	const repairModuleList = ref([]);
	// 获取返厂模块列表
	const getMobileRepairModule = async () => {
		await return_fac_api.getMobileRepairModule().then((res) => {
			if (res.code == 20000) {
				repairModuleList.value = res.data.rows.map((o) => {
					// return {
					// 	text: o.name,
					// 	value: o.id,
					// 	disable: o.disabled,
					// }
					return o;
				});
			}
		});
	};
	// 获取自定义字段--服务方式修改
	const changeModuleField = async (id) => {
		// 清空网点列表
		orderData.value.networkId = 0;
		orderData.value.repairModuleId = id;
		if (id) {
			orderData.value.fieldValVos = [];
			await getModuleField(id);
		} else {
			orderData.value.fieldValVos = [];
		}

		// 获取默认返厂地址
		if (!showNetwork.value) {
			const {data, code} =
				await return_fac_api.getRepairModuleCallbackFactoryAddr(id);
			if (code == 20000) {
				defaultAddress.value = data.row || {};
			}
		}

		showPopup_way.value.close();
	};
	const selectModuleFn = async () => {
		await getMobileRepairModule();
		showPopup_way.value.open();
	};
	// 获取自定义字段
	const getModuleField = async (id) => {
		await return_fac_api.getRepairModuleField(id).then((res) => {
			if (res.code == 20000) {
				if (res.data.rows.length > 0) {
					orderData.value.fieldValVos = res.data.rows.map((o) => {
						o.repairFieldId = o.id;
						o.id = null;
						o.contentVos = o.contentVos.map((i) => {
							return {
								text: i.val,
								value: i.val,
							};
						});
						if (o.type == 5 || o.type == 6 || o.type == 7) {
							o.imgarr = [];
						} else if (o.type == 4) {
							o.value = [];
						} else {
							o.value = '';
						}
						return o;
					});
				}
			}
		});
	};
	const showPopup_way = ref();
	const showPopup_user = ref();
	const userList = ref([]);
	// 联系人隐藏显示
	// const is_input = ref(false)
	// 获取客户下拉数据
	const getUserDataSelect = _.debounce(
		() => {
			let selectUserVo = {
				limit: 0,
				name: orderData.value.name,
				page: 0,
			};
			// if (selectUserVo.name) {
			// is_input.value = true
			return_fac_api.getUserDataSelect(selectUserVo).then((res) => {
				if (res.code == 20000) {
					userList.value = res.data.rows;
				}
			});
			// }
		},
		800,
		{leading: false},
	);
	const addressRefUser = ref();
	const addressValueUser = ref();
	// 联系人地址变化
	const changeAddressUser = () => {
		let item = addressRefUser.value.address;
		orderData.value.area = item.area;
		orderData.value.city = item.city;
		orderData.value.province = item.province;
		addressValueUser.value = {
			area: item.area,
			city: item.city,
			province: item.province,
			town: '', //镇
		};
	};
	// 选择联系人
	const checkUserItem = (item) => {
		orderData.value.address = item.address;
		orderData.value.area = item.area;
		orderData.value.city = item.city;
		orderData.value.province = item.province;
		orderData.value.userId = item.userId;
		orderData.value.username = item.username;
		orderData.value.phone = item.phone;
		addressValueUser.value = {
			area: item.area,
			city: item.city,
			province: item.province,
			town: '', //镇
		};
		if (orderData.value.receiveAddrVo.customerTakePieceMode == 1) {
			orderData.value.receiveAddrVo = {
				customerReceiveAddress: item.address,
				customerReceiveArea: item.area,
				customerReceiveCity: item.city,
				customerReceivePhone: item.phone,
				customerReceiveProvince: item.province,
				customerReceiveUsername: item.username,
				customerTakePieceMode: 1, //客户取件方式：1-自取，2-快递寄回=收货信息
			};
			addressValue.value = {
				province: item.province, //省
				city: item.city, //市
				area: item.area, //区
				town: '', //镇
			};
		}
		showPopup_user.value.close();
	};
	const showBottom = ref(false);
	//选择联系人
	const selectUserFn = () => {
		orderData.value.name = '';
		// userList.value =[]
		getUserDataSelect();
		showPopup_user.value.open();
	};
	const orderUser = ref({
		address: '',
		area: '',
		city: '',
		phone: '',
		province: '',
		name: '',
		userId: '',
	});
	const editAddressFn = () => {
		orderUser.value = {
			address: orderData.value.address, //客户详细地址
			area: orderData.value.area, //客户地址-县/区
			city: orderData.value.city, //客户地址-市
			province: orderData.value.province, //客户地址-省
			userId: orderData.value.userId, //用户ID
			name: orderData.value.username, //客户姓名
			phone: orderData.value.phone, //客户手机号
		};
		showBottom.value = true;
	};

	// 添加服务地址
	const addUserAddress = () => {
		orderUser.value = {
			address: '',
			area: '',
			city: '',
			phone: '',
			province: '',
			name: '',
			userId: '',
		};
		showPopup_user.value.close();
		showBottom.value = true;
	};
	// 修改地址变化
	const userAddressChange = (obj) => {
		orderData.value.userId = obj.userId;
		orderData.value.address = obj.address;
		orderData.value.area = obj.area;
		orderData.value.city = obj.city;
		orderData.value.province = obj.province;
		orderData.value.username = obj.name;
		orderData.value.phone = obj.phone;
		if (orderData.value.receiveAddrVo.customerTakePieceMode == 1) {
			orderData.value.receiveAddrVo = {
				customerReceiveAddress: obj.address,
				customerReceiveArea: obj.area,
				customerReceiveCity: obj.city,
				customerReceivePhone: obj.phone,
				customerReceiveProvince: obj.province,
				customerReceiveUsername: obj.name,
				customerTakePieceMode: 1, //客户取件方式：1-自取，2-快递寄回=收货信息
			};
			addressValue.value = {
				province: obj.province, //省
				city: obj.city, //市
				area: obj.area, //区
				town: '', //镇
			};
		}
	};
	// 获取服务网点
	const showPopup_net = ref();
	const selectVo = ref({
		area: '',
		city: '',
		limit: 0,
		name: '',
		page: 0,
		province: '',
	});
	const networkList = ref([]);
	const getNetwrokSelectFn = async () => {
		uni.showLoading({
			title: '加载中...',
			mask: true,
		});
		await apiOrder.getNetworkAddrselect(selectVo.value).then((res) => {
			uni.hideLoading();
			if ((res.code = 20000)) {
				networkList.value = res.data.rows;
			}
		});
	};

	// open 网点列表
	const getnetworkList = async () => {
		selectVo.value.name = '';
		await getNetwrokSelectFn();
		showPopup_net.value.open();
	};
	const input = _.debounce(
		() => {
			getNetwrokSelectFn();
		},
		600,
		{leading: false},
	);
	const checkNetItem = (item) => {
		orderData.value.networkName = item;
		orderData.value.networkId = item.id;
		showPopup_net.value.close();
	};
	const clearNetName = () => {
		orderData.value.networkId = '';
		orderData.value.networkName = null;
	};
	onUnload(() => {
		uni.hideLoading();
	});
	// 跳转到添加商品
	const addReturnFactory = () => {
		let arr = store.state.repairGoodsVos.map((o) => {
			o.isShow = false;
			return o;
		});
		store.commit('setrepairGoodsVos', arr);
		uni.navigateTo({
			url: '/pages_user/return_factory/add_return_factory',
		});
	};
	const addressValue = ref();
	const addressRef = ref(); //地址组件元素
	const customerReceiveList = ref([
		{text: '自取', value: '1'},
		{text: '快递寄回', value: '2'},
	]);
	const showPopup_Pick_up = ref();
	const current = ref('1');
	const baseForm = ref();
	const pickMode = () => {
		showPopup_Pick_up.value.open();
		current.value = orderData.value.receiveAddrVo.customerTakePieceMode;
		addressValue.value = {
			province: orderData.value.receiveAddrVo.customerReceiveProvince, //省
			city: orderData.value.receiveAddrVo.customerReceiveCity, //市
			area: orderData.value.receiveAddrVo.customerReceiveArea, //区
			town: '', //镇
		};
	};
	// 选择寄回方式
	const radioChange = (val) => {
		current.value = val.detail.value;
	};
	// 校验手机号
	const baseFormRules = ref({
		customerReceivePhone: {
			rules: [
				{
					required: true,
					errorMessage: '请输入联系手机号',
				},
				{
					validateFunction: (rule, value, data, callback) => {
						if (!/^1[^1^2]\d{9}$/.test(value)) {
							callback('请输入正确的手机号');
						}
						return true;
					},
				},
			],
		},
	});
	// 删除报修商品
	const deleteGoodsItemFun = (index) => {
		let arrGoods = _.cloneDeep(store.state.repairGoodsVos);
		arrGoods.splice(index, 1);
		store.commit('setrepairGoodsVos', arrGoods);
	};
	// 取件地址变化
	const changecustomerReceive = () => {
		orderData.value.receiveAddrVo.customerReceiveProvince =
			addressRef.value.address.province;
		orderData.value.receiveAddrVo.customerReceiveCity =
			addressRef.value.address.city;
		orderData.value.receiveAddrVo.customerReceiveArea =
			addressRef.value.address.area;
	};
	// 提交修改寄件方式
	const submitChange = () => {
		if (current.value == '2') {
			baseForm.value
				?.validate()
				.then((res) => {
					orderData.value.receiveAddrVo.customerTakePieceMode = current.value;
					showPopup_Pick_up.value.close();
				})
				.catch((err) => {
					let str = err.map((o) => o.errorMessage);
					uni.showToast({
						title: str[0],
						icon: 'none',
						duration: 2000,
					});
				});
		} else {
			orderData.value.receiveAddrVo.customerTakePieceMode = current.value;
			showPopup_Pick_up.value.close();
		}
	};
	const imageStyles = ref({
		height: 72, // 边框高度
		width: 72, // 边框宽度
		border: {
			// 如果为 Boolean 值，可以控制边框显示与否
			color: '#eee', // 边框颜色
			width: '1px', // 边框宽度
			style: 'solid', // 边框样式
			radius: '0px',
		},
	});
	// 查看视频
	const popupvideoRef = ref();
	const videoUrl = ref('');
	const videoUrlShow = (url) => {
		videoUrl.value = url;
		popupvideoRef.value.open();
	};
	const urlClickShow = (v) => {
		if (!v.show) videoUrl.value = '';
	};
	// 选择图片后触发
	const onsuccessImg2 = (item, files) => {
		files.tempFiles.filter((o) => {
			if (o.size > item.uploadSize * 1024 * 1024) {
				uni.showToast({
					icon: 'none',
					title: `图片超过限制大小${item.uploadSize}MB`,
				});
			} else {
				item.imgarr.push(o);
			}
		});
	};
	// 图片从列表移除时触发
	const ondeleteImg2 = (item, file) => {
		item.imgarr = item.imgarr.filter((o) => {
			return o.uuid != file.tempFile.uuid;
		});
	};
	// 上传视频
	const chooseVideoImage = (item, file) => {
		if (file.tempFiles[0].size > item.uploadSize * 1024 * 1024) {
			uni.showToast({
				icon: 'none',
				title: `视频超过限制大小${item.uploadSize}MB`,
			});
		} else {
			item.imgarr.push(file.tempFiles[0]);
		}
	};
	// 附件上传
	function chooseFile(item, files) {
		files.tempFiles.filter((o) => {
			if (o.size > item.uploadSize * 1024 * 1024) {
				uni.showToast({
					icon: 'none',
					title: `pdf超过限制大小${item.uploadSize}MB`,
				});
			} else {
				item.imgarr.push(o);
			}
		});
	}
	// 查看附件
	const lookPDF = (url) => {
		uni.openDocument({
			filePath: url,
			fileType: 'pdf',
			success: function (res) {},
			fail: function (err) {
				uni.showToast({
					icon: 'none',
					title: err,
				});
			},
		});
	};
	// 删除视频
	const delete_video = (item, index) => {
		item.imgarr.splice(index, 1);
	};
	// 提交
	const submitFun = _.debounce(
		async () => {
			if (store.state.repairGoodsVos.length == 0) {
				uni
					.showModal({
						title: '提示',
						content: '请先添加报修商品',
						confirmText: '去添加',
					})
					.then((res) => {
						//确认
						if (res.confirm) {
							uni.navigateTo({
								url: '/pages_user/return_factory/add_return_factory',
							});
							return;
						}
					});
				return;
			}
			if (!orderData.value.province || !orderData.value.address) {
				uni.showToast({
					icon: 'none',
					title: `请填写联系人地址`,
				});
				return;
			}
			await formRef.value
				.validate()
				.then(async (res) => {
					// if (!is_input.value) {
					// 	uni.showToast({
					// 		title: '客户名称搜索，获取联系人信息',
					// 		icon: 'none',
					// 		duration: 3000
					// 	})
					// 	return
					// }
					uni.showLoading({
						title: '加载中...',
						mask: true,
					});
					let dataValue = _.cloneDeep(orderData.value);
					// 商品数据
					dataValue.repairGoodsVos = store.state.repairGoodsVos;

					// 上传图片获取图片
					// 处理上传图片
					if (dataValue.repairGoodsVos.length > 0) {
						for (let i = 0; i < dataValue.repairGoodsVos.length; i++) {
							let tmp = dataValue.repairGoodsVos[i];
							tmp.paths = [];
							if (tmp.imgarr.length > 0) {
								for (let j = 0; j < tmp.imgarr.length; j++) {
									let img = tmp.imgarr[j];
									await apiUpload
										.uploadOrderFile({files: img.file})
										.then((res) => {
											tmp.paths.push(res.data.rows[0]);
										});
								}
							}
						}
					}
					if (dataValue.fieldValVos.length > 0) {
						for (let key in dataValue.fieldValVos) {
							let item = dataValue.fieldValVos[key];
							item['optionVos'] = [];
							if (item.type === 4) {
								for (let i = 0; i < item.value.length; i++) {
									let tmp = item.value[i];
									item.optionVos.push({id: '', optValue: tmp});
								}
							} else if (item.type === 5 || item.type === 6) {
								for (let i = 0; i < item.imgarr.length; i++) {
									let tmp = item.imgarr[i];
									await apiUpload
										.uploadOrderFile({files: tmp.file})
										.then((res) => {
											item.optionVos.push({id: '', optValue: res.data.rows[0]});
										});
								}
							} else if (item.type === 7) {
								for (let i = 0; i < item.imgarr.length; i++) {
									let tmp = item.imgarr[i];
									await apiUpload
										.orderVideoUpload({files: tmp.file})
										.then((res) => {
											item.optionVos.push({id: '', optValue: res.data.rows[0]});
										});
								}
							} else if (item.type == 8) {
								item.optionVos = [
									{id: '', optValue: Math.floor(Number(item.value) * 2)},
								];
							} else {
								item.optionVos = [{id: '', optValue: item.value}];
							}
						}

						dataValue.fieldValVos = dataValue.fieldValVos.map((o) => {
							return {
								repairFieldId: o.repairFieldId,
								repairModuleFieldRelationId: o.repairModuleFieldRelationId,
								id: '',
								name: o.name,
								optionVos: o.optionVos,
								type: o.type,
							};
						});
					}

					// 处理上传视频
					if (dataValue.repairGoodsVos.length > 0) {
						for (let i = 0; i < dataValue.repairGoodsVos.length; i++) {
							let tmp = dataValue.repairGoodsVos[i];
							if (tmp.videoPaths.length > 0) {
								for (let j = 0; j < tmp.videoPaths.length; j++) {
									let video = tmp.videoPaths[j];
									await apiUpload
										.orderVideoUpload({files: {path: video}})
										.then((res) => {
											tmp.videoPaths[j] = res.data.rows[0];
										});
								}
							}
						}
					}

					// 客户类型: 1-客户，2-网点
					dataValue.userType = 1;

					await return_fac_api.saveReturnFac(dataValue).then((res) => {
						if (res.code == 20000) {
							uni.hideLoading();
							uni.showToast({
								title: '报修成功',
								icon: 'success',
							});
							orderData.value = {
								address: '', //客户详细地址
								area: '', //客户地址-县/区
								city: '', //客户地址-市
								province: '', //客户地址-省
								userId: '', //用户ID
								username: '', //客户姓名
								otherPhone: '', //客户其他联系方式
								phone: '', //客户手机号
								repairModuleId: '', //返厂模块ID
								fieldValVos: [], //返厂自定义字段
								networkId: '', //服务网点
								networkName: '',
								receiveAddrVo: {
									//收货地址
									customerReceiveAddress: '',
									customerReceiveArea: '',
									customerReceiveCity: '',
									customerReceivePhone: '',
									customerReceiveProvince: '',
									customerReceiveUsername: '',
									customerTakePieceMode: 1, //客户取件方式：1-自取，2-快递寄回=收货信息
								},
								repairGoodsVos: [], //返厂商品
							};
							store.commit('setrepairGoodsVos', []);
							uni.redirectTo({
								url:
									'/pages_user/return_factory/factory_detail?id=' +
									res.data.row.repairId,
							});
						}
					});
					uni.hideLoading();
				})
				.catch((err) => {
					let str = err.map((o) => o.errorMessage);
					uni.showToast({
						title: str[0],
						icon: 'none',
						duration: 2000,
					});
				});
		},
		800,
		{leading: false},
	);
</script>

<style lang="scss" scoped>
	.service-mode-value,
	.return-factory-address-value {
		padding-right: 30rpx;
	}

	.return-factory-address-lebel {
		font-size: 28rpx;
		padding-left: 14rpx;
	}

	.fac_main {
		/* #ifdef H5 */
		height: calc(100vh - 44px);
		/* #endif */
		/* #ifndef H5 */
		height: 100vh;
		/* #endif */
		width: 100%;
		background: #fafafa;
		display: flex;
		flex-direction: column;
		overflow: auto;

		&::-webkit-scrollbar {
			width: 0;
			height: 0;
			background-color: transparent;
		}

		&_bgBox {
			margin: 24rpx;
			padding-bottom: 220rpx;
			display: flex;
			flex-direction: column;

			.uni-section {
				background-color: transparent;
			}

			:deep(.uni-section-header) {
				padding: 24rpx 0 12rpx;
				font-size: 30rpx;
			}

			.uni-select__input-placeholder {
				font-size: 28rpx;
			}

			:deep(.uni-forms-item__label) {
				font-size: 28rpx;
				height: 44rpx;
				padding-bottom: 4rpx;
				line-height: normal;
				color: #000;
			}

			:deep(.uni-easyinput__content-input) {
				font-size: 28rpx;
			}

			:deep(.uni-date-x--border) {
				border-radius: 0;
				font-size: 28rpx;

				.uni-date-x {
					border-radius: 0;
				}
			}

			:deep(.uni-select) {
				border-radius: 0;

				.uni-select__input-placeholder {
					text-align: right;
					margin-right: 12rpx;
					font-size: 28rpx;
					color: #999;
				}
			}

			:deep(.uni-forms-item) {
				margin-bottom: 26rpx;
				padding: 0rpx 24rpx;

				.uni-forms-item__error {
					left: auto;
					right: 0;
					padding-top: 2rpx;
				}

				.is-input-border {
					border-radius: 0;
				}

				.team_type {
					height: 100%;
					display: flex;
					align-items: center;
					flex: 1;
				}

				.team_type_ {
					border-bottom: solid 1px #eee;
				}
			}

			:deep(.show_input) {
				border: 1px solid #e5e5e5;
				height: 35px;
				position: relative;
			}

			:deep(.left_right_form) {
				.uni-forms-item.is-direction-top {
					flex-direction: row;
					align-items: center;

					.uni-forms-item__label {
						padding-bottom: 0;
					}

					.checklist-group {
						justify-content: flex-end;
					}
				}

				.item_content {
					display: flex;
					align-items: center;
					justify-content: flex-end;
				}

				.sel_address {
					font-size: 28rpx;
					color: #000;
					width: 100%;
					flex: 1;
					display: flex;
					align-items: center;
					justify-content: flex-end;
					padding-left: 24rpx;
					box-sizing: border-box;

					.text_9 {
						color: #999;
						line-height: 42rpx;
					}

					.tipadd {
						display: flex;
						flex-wrap: wrap;
						word-wrap: break-word;
						word-break: break-all;
						justify-content: flex-end;
						text-align: right;

						.user_name {
							text-align: right;
						}
					}
				}
			}

			:deep(.uni-easyinput__content-textarea) {
				height: 100%;
				line-height: normal;
				min-height: 120rpx;
				max-height: 160rpx;
				margin: 0;
				padding: 12rpx 20rpx;
				overflow: auto;
				font-size: 28rpx;
			}

			.pic_img {
				:deep(.icon-add) {
					width: 26rpx;
					height: 3rpx;
					background-color: #999;
				}

				:deep(.icon-del) {
					width: 24rpx;
				}

				:deep(.icon-del-box) {
					width: 40rpx;
					height: 40rpx;
					top: 0;
					right: 0;
					background-color: rgba(0, 0, 0, 0.3);
				}

				:deep(.file-picker__box-content) {
					border-radius: 0 !important;

					.file-picker__progress {
						display: none !important;
					}
				}
			}

			:deep(.file-picker__progress-item) {
				display: none;
			}

			.pic_video {
				display: flex;
				align-items: center;
				flex-wrap: wrap;
				gap: 20rpx;

				.list_video {
					display: flex;
					align-items: center;
					flex-wrap: wrap;

					.box_video {
						width: 120rpx;
						height: 120rpx;
						// margin-right: 20rpx;
						// margin-bottom: 20rpx;
						position: relative;

						.clear_icon {
							position: absolute;
							top: 0;
							right: 0;
							z-index: 2;
							width: 40rpx;
							height: 40rpx;
							display: flex;
							align-items: center;
							justify-content: center;

							&:after {
								content: '';
								background-color: rgba(0, 0, 0, 0.3);
								position: absolute;
								top: 0;
								right: 0;
								z-index: -1;
								width: 40rpx;
								height: 40rpx;
								border-radius: 50%;
							}
						}

						.item_video {
							width: 100%;
							height: 100%;
						}
					}

					.box_video_pdf {
						width: 120rpx;
						height: 120rpx;
						// margin-right: 20rpx;
						// margin-bottom: 20rpx;
						position: relative;

						.pdf_sty {
							background-color: rgb(250, 81, 81);
							width: 100%;
							height: 100%;
							color: #fff;
							text-align: center;
							font-size: 22rpx;
							position: relative;
							display: flex;
							align-items: center;
							justify-content: center;

							&:before {
								content: '';
								position: absolute;
								z-index: 2;
								border: 12rpx solid #0000002b;
								right: 0rpx;
								top: 0rpx;
								border-top: 12rpx solid #fff;
								border-right: 12rpx solid #fff;
							}
						}

						.clear_icon {
							position: absolute;
							top: 0;
							right: 0;
							z-index: 4;
							width: 40rpx;
							height: 40rpx;
							display: flex;
							align-items: center;
							justify-content: center;

							&:after {
								content: '';
								background-color: rgba(0, 0, 0, 0.3);
								position: absolute;
								top: 0;
								right: 0;
								z-index: -1;
								width: 40rpx;
								height: 40rpx;
								border-radius: 50%;
							}
						}
					}
				}

				.btn_uploader {
					border: 1px solid #eeeeee;
					width: 120rpx;
					height: 120rpx;
					display: flex;
					justify-content: center;
					align-items: center;
					border-radius: 0;
					// margin-right: 20rpx;
					// margin-bottom: 20rpx;
					position: relative;
					overflow: hidden;

					.icon_plus {
						width: 100%;
						height: 100%;
						display: flex;
						justify-content: center;
						align-items: center;
					}
				}

				:deep(.uni-file-picker__files) {
					position: absolute;
					top: 0;
					right: 0;
					z-index: 4;
					width: 100%;
					height: 100%;
					opacity: 0;
				}
			}

			.fac_header_add {
				height: 160rpx;
				background-color: #f2f9ff;
				border: 1px solid #007cff;
				border-radius: 10rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: 28rpx;
				color: #007cff;

				.tip_star {
					color: #f56c6c;
					font-weight: bold;
					// padding-right: 6rpx;
				}
			}

			.fac_goods {
				.goods_list {
					display: flex;
					flex-direction: column;
					// row-gap: 24rpx;
					background-color: #fff;

					.goods_list_item {
						& ~ .goods_list_item {
							border-top: 1px solid #eee;
						}

						padding: 24rpx;
						display: flex;
						align-items: center;
						column-gap: 12;

						.goods_list_item_box {
							display: flex;
							flex-direction: column;
							flex: 1;

							.label_item {
								display: flex;
								font-size: 26rpx;

								.label_item_title {
									color: #777;
									flex: none;
								}

								.label_item_content {
									flex: 1;
									word-wrap: break-word;
									word-break: break-all;
								}
							}
						}
					}
				}
			}

			.service_mode {
				display: flex;
				align-items: center;
				justify-content: space-between;
				font-size: 28rpx;

				.tip {
					color: #007cff;
				}
			}

			.item_fee {
				background-color: #fff;
				padding: 24rpx 0 0;

				&_tableHead {
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-bottom: 24rpx;

					&_left {
						font-size: 28rpx;
						font-weight: bold;
						display: flex;
						align-items: center;

						.down_up {
							width: 0;
							height: 0;
							border-right: 12rpx solid transparent;
							border-left: 12rpx solid transparent;
							border-top: 14rpx solid #000;
							margin-right: 6rpx;
						}

						.down_up_ {
							width: 0;
							height: 0;
							border-right: 12rpx solid transparent;
							border-left: 12rpx solid transparent;
							border-bottom: 14rpx solid #000;
							margin-right: 6rpx;
						}
					}
				}

				.pic_img {
					:deep(.file-title) {
						font-size: 28rpx;
					}

					:deep(.uni-file-picker__header) {
						padding-top: 24rpx;
					}

					:deep(.icon-add) {
						width: 30rpx;
						height: 3rpx;
						background-color: #aaa;
					}

					:deep(.icon-del) {
						width: 24rpx;
					}

					:deep(.icon-del-box) {
						width: 40rpx;
						height: 40rpx;
						top: 0;
						right: 0;
						background-color: rgba(0, 0, 0, 0.3);
					}

					:deep(.uni-progress-bar) {
						display: none;
					}
				}
			}
		}

		:deep(.file-picker__progress-item) {
			display: none;
		}

		.footer_order {
			display: flex;
			align-items: center;
			background-color: #ffffff;
			z-index: 9;
			height: 140rpx;
			position: fixed;
			bottom: 0;
			width: 100%;
			padding: 48rpx 48rpx 60rpx;
			box-sizing: border-box;
			border-top: 1px solid #eee;

			&_left {
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				font-size: 24rpx;
				margin-right: 24rpx;

				.gray_tip {
					color: #007cff;
				}
			}

			&_right {
				flex: 1;
				border-radius: 45rpx;
				height: 80rpx;
				background-color: #007cff;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #fff;
				font-size: 28rpx;
				font-weight: bold;
			}
		}

		.popup-content {
			height: 86vh;
			background-color: #ffffff;
			margin: 0 auto;
			border-radius: 20rpx 20rpx 0 0;
			overflow: hidden;
			display: flex;
			flex-direction: column;
			flex: 1;

			&_title {
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding: 24rpx 30rpx 0;

				.title_tip {
					font-size: 30rpx;
					font-weight: bold;
				}

				.title_right {
					color: #007cff;
				}
			}

			.search_card {
				display: flex;
				align-items: center;
				margin: 0 24rpx;

				&_bar {
					flex: 1;
				}

				.search_btn {
					font-size: 28rpx;
					color: #007cff;
					font-weight: bold;
				}
			}

			.add_address {
				display: flex;
				justify-content: flex-end;
				color: #007cff;
				cursor: pointer;
				padding: 0 24rpx 0;
				font-size: 28rpx;
			}

			.search_muen {
				flex: 1;
				overflow: auto;
				margin: 0 24rpx;
				padding-bottom: 15%;

				&::-webkit-scrollbar {
					width: 0;
					height: 0;
					background-color: transparent;
				}

				&_item {
					font-size: 28rpx;
					border-bottom: 1rpx solid rgba(242, 243, 245, 1);
					padding: 20rpx 24rpx;
					display: flex;
					flex-direction: column;
					row-gap: 6rpx;
				}

				.muen_item_title {
					font-size: 28rpx;
					text-overflow: ellipsis;
					overflow: hidden;
					white-space: nowrap;
				}

				.muen_item_tip {
					font-size: 24rpx;
					color: #777;
					word-wrap: break-word;
					word-break: break-all;

					.icon_tip {
						margin-left: 6rpx;
						border-radius: 50%;
					}
				}

				.active_bg {
					background-color: #f2f9ff;
				}

				.msg_kong {
					color: #999;
					font-size: 32rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					margin: auto;
					height: 80%;
				}
			}
		}

		.popup_address {
			.uni-list-cell {
				margin: 0 24rpx;
				padding: 24rpx;
				display: flex;
				justify-content: space-between;
				border-bottom: 1px solid #eee;
				font-size: 28rpx;
			}

			:deep(.uni-easyinput__content-input) {
				font-size: 28rpx;
			}

			.address_btn {
				position: fixed;
				bottom: 0rpx;
				right: 0;
				left: 0;
				z-index: 6;
				background-color: #fff;
				border-top: 1rpx solid #eee;

				.btn_addres {
					padding: 30rpx 0 40rpx;

					:deep(button:after) {
						border: none !important;
					}

					.btn {
						border-radius: 50rpx;
						height: 80rpx;
						line-height: 80rpx;
						font-size: 32rpx;
						background-color: #007cff;
						margin: 0 48rpx;
					}
				}
			}

			.uni_form {
				background-color: #fff;
				border-radius: 10rpx;
				padding: 10rpx 30rpx;
				margin: 0 24rpx;

				:deep(.left_right_form) {
					.uni-forms-item.is-direction-top {
						flex-direction: row;

						.uni-forms-item__label {
							padding-bottom: 0;
						}

						.checklist-group {
							justify-content: flex-end;
						}
					}

					.item_content {
						display: flex;
						align-items: center;
						justify-content: flex-end;
					}
				}

				:deep(.btn_input) {
					display: flex;
					align-items: center;
					height: 35px;
					border-bottom: solid 1px #eee;
					width: 100%;

					.uniui-bottom::before {
						color: #999;
						font-size: 14px;
					}

					.icon {
						top: -20%;
					}
				}

				:deep(.uni-forms-item) {
					margin-bottom: 20rpx;

					.uni-forms-item__error {
						left: auto;
						right: 0;
						padding-top: 2rpx;
					}

					.item_zip {
						display: flex;
						align-items: center;
					}
				}

				:deep(.is-input-border) {
					border: none;
					border-bottom: 1px solid transparent;
					border-radius: 0;

					&.is-focused {
						.uniui-clear,
						.uniui-eye-filled {
							color: #007cff99 !important;
						}
					}
				}

				.message {
					border: solid 1px #eee;

					:deep(textarea) {
						font-size: 28rpx;
						width: auto;
						min-height: 100rpx;
						padding: 8rpx 12rpx;
						min-height: 100rpx;
						box-sizing: border-box;
					}
				}
			}

			.discern_in {
				background-color: #fff;
				padding: 20rpx;
				position: relative;
				border-radius: 10rpx;
				margin: 24rpx 0;

				.btn_btn {
					position: absolute;
					right: 20rpx;
					bottom: 32rpx;
					display: flex;
					align-items: center;

					.max_text {
						color: #999;
						font-size: 24rpx;
						margin-right: 10rpx;
					}

					.btn_btn_ia {
						border-radius: 50rpx;
						font-size: 22rpx;
						background-color: #007cff;
						border-color: #007cff;
						height: 40rpx;
						line-height: 40rpx;
						padding: 0 10rpx;
					}

					:deep(button::after) {
						border: none;
					}
				}
			}

			.default {
				background-color: #fff;
				border-radius: 10rpx;
				padding: 20rpx 24rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin: 24rpx 0;

				.tip {
					font-size: 28rpx;
					color: #606266;
				}
			}

			.delete_adrs {
				background-color: #fff;
				border-radius: 10rpx;
				margin: 24rpx 0;
				padding: 24rpx 0;
				display: flex;
				justify-content: center;
				align-items: center;
				color: #f56c6c;
			}
		}
	}
</style>
